<!DOCTYPE html>
<html  lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!--360浏览器优先以webkit内核解析-->
    <title>介绍</title>
    <link rel="shortcut icon" href="favicon.ico">
    <link href="../static/css/bootstrap.min.css" th:href="@{/css/bootstrap.min.css}" rel="stylesheet"/>
    <link href="../static/css/font-awesome.min.css" th:href="@{/css/font-awesome.min.css}" rel="stylesheet"/>
    <link href="../static/css/style.min.css" th:href="@{/css/style.min.css}" rel="stylesheet"/>
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="col-sm-12">
            <blockquote class="text-warning" style="font-size:14px">
                                          消息内容提醒
            </blockquote>

            <hr>
        </div>

        <div class="row">
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>边缘网关</h5>
                        <h1 class="no-margins">3</h1>
                        <div class="stat-percent font-bold text-navy">98% <i class="fa fa-bolt"></i></div>
                        <small>总数</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>实例</h5>
                        <h1 class="no-margins">12</h1>
                        <div class="stat-percent font-bold text-navy">98% <i class="fa fa-bolt"></i></div>
                        <small>总数</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>设备</h5>
                        <h1 class="no-margins">6</h1>
                        <div class="stat-percent font-bold text-danger">12% <i class="fa fa-level-down"></i></div>
                        <small>总数</small>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>消息</h5>
                        <h1 class="no-margins">54</h1>
                        <div class="stat-percent font-bold text-danger">24% <i class="fa fa-level-down"></i></div>
                        <small>总数</small>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>预警</h5>
                        <table class="table table-stripped small m-t-md">
                            <tbody>
                            <tr>
                                <td class="no-borders">
                                    <i class="fa fa-circle text-navy"></i>
                                </td>
                                <td class="no-borders">
                                    边缘设备1672378596985
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <i class="fa fa-circle text-danger"></i>
                                </td>
                                <td>
                                    边缘设备1672378596985
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <i class="fa fa-circle text-danger"></i>
                                </td>
                                <td>
                                    边缘设备1672378596985
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>边缘网关</h5>
                        <table class="table table-stripped small m-t-md">
                            <tbody>
                            <tr>
                                <td class="no-borders">
                                    <i class="fa fa-circle text-navy"></i>
                                </td>
                                <td class="no-borders">
                                    224边缘网关
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <i class="fa fa-circle text-navy"></i>
                                </td>
                                <td>
                                    122边缘网关
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <i class="fa fa-circle text-danger"></i>
                                </td>
                                <td>
                                    测试网关
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>设备</h5>
                        <table class="table table-stripped small m-t-md">
                            <tbody>
                            <tr>
                                <td class="no-borders">
                                    <i class="fa fa-circle text-navy"></i>
                                </td>
                                <td class="no-borders">
                                    边缘设备1672378596985
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <i class="fa fa-circle text-navy"></i>
                                </td>
                                <td>
                                    边缘设备1672378596985
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <i class="fa fa-circle text-navy"></i>
                                </td>
                                <td>
                                    边缘设备1672378596985
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="col-sm-3">
                <div class="ibox">
                    <div class="ibox-content">
                        <h5>实例</h5>
                        <table class="table table-stripped small m-t-md">
                            <tbody>
                            <tr>
                                <td class="no-borders">
                                    <i class="fa fa-circle text-danger"></i>
                                </td>
                                <td class="no-borders">
                                    Test
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <i class="fa fa-circle text-navy"></i>
                                </td>
                                <td>
                                    8430893ecaedd0b7
                                </td>
                            </tr>
                            <tr>
                                <td>
                                    <i class="fa fa-circle text-navy"></i>
                                </td>
                                <td>
                                    test01
                                </td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>


    </div>

    <script th:src="@{/js/jquery.min.js}"></script>
    <script th:src="@{/js/bootstrap.min.js}"></script>
    <script th:src="@{/ajax/libs/layer/layer.min.js}"></script>
    <script type="text/javascript">
	    $('#pay-qrcode').click(function(){
	        var html=$(this).html();
	        parent.layer.open({
	            title: false,
	            type: 1,
	            closeBtn:false,
	            shadeClose:true,
	            area: ['600px', '360px'],
	            content: html
	        });
	    });
    </script>
</body>
</html>
